<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<meta name="generator" content="JsDoc Toolkit" />
		
		<title>JsDoc Reference - odr.DrawableItem</title>

		<style type="text/css">
			/* default.css */
body
{
	font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif;
	width: 800px;
}

.header
{
	clear: both;
	background-color: #ccc;
	padding: 8px;
}

h1
{
	font-size: 150%;
	font-weight: bold;
	padding: 0;
	margin: 1em 0 0 .3em;
}

hr
{
	border: none 0;
	border-top: 1px solid #7F8FB1;
	height: 1px;
}

pre.code
{
	display: block;
	padding: 8px;
	border: 1px dashed #ccc;
}

#index
{
	margin-top: 24px;
	float: left;
	width: 160px;
	position: absolute;
	left: 8px;
	background-color: #F3F3F3;
	padding: 8px;
}

#content
{
	margin-left: 190px;
	width: 600px;
}

.classList
{
	list-style-type: none;
	padding: 0;
	margin: 0 0 0 8px;
	font-family: arial, sans-serif;
	font-size: 1em;
	overflow: auto;
}

.classList li
{
	padding: 0;
	margin: 0 0 8px 0;
}

.summaryTable { width: 100%; }

h1.classTitle
{
	font-size:170%;
	line-height:130%;
}

h2 { font-size: 110%; }
caption, div.sectionTitle
{
	background-color: #7F8FB1;
	color: #fff;
	font-size:130%;
	text-align: left;
	padding: 2px 6px 2px 6px;
	border: 1px #7F8FB1 solid;
}

div.sectionTitle { margin-bottom: 8px; }
.summaryTable thead { display: none; }

.summaryTable td
{
	vertical-align: top;
	padding: 4px;
	border-bottom: 1px #7F8FB1 solid;
	border-right: 1px #7F8FB1 solid;
}

/*col#summaryAttributes {}*/
.summaryTable td.attributes
{
	border-left: 1px #7F8FB1 solid;
	width: 140px;
	text-align: right;
}

td.attributes, .fixedFont
{
	line-height: 15px;
	color: #002EBE;
	font-family: "Courier New",Courier,monospace;
	font-size: 13px;
}

.summaryTable td.nameDescription
{
	text-align: left;
	font-size: 13px;
	line-height: 15px;
}

.summaryTable td.nameDescription, .description
{
	line-height: 15px;
	padding: 4px;
	padding-left: 4px;
}

.summaryTable { margin-bottom: 8px; }

ul.inheritsList
{
	list-style: square;
	margin-left: 20px;
	padding-left: 0;
}

.detailList {
	margin-left: 20px; 
	line-height: 15px;
}
.detailList dt { margin-left: 20px; }

.detailList .heading
{
	font-weight: bold;
	padding-bottom: 6px;
	margin-left: 0;
}

.light, td.attributes, .light a:link, .light a:visited
{
	color: #777;
	font-style: italic;
}

.fineprint
{
	text-align: right;
	font-size: 10px;
}
		</style>
	</head>

	<body>
<!-- ============================== header ================================= -->	
		<!-- begin static/header.html -->
		<div id="header">
</div>
		<!-- end static/header.html -->

<!-- ============================== classes index ============================ -->
		<div id="index">
			<!-- begin publish.classesIndex -->
			<div align="center"><a href="../index.html">Class Index</a>
| <a href="../files.html">File Index</a></div>
<hr />
<h2>Classes</h2>
<ul class="classList">
	
	<li><i><a href="../symbols/_global_.html">_global_</a></i></li>
	
	<li><a href="../symbols/Function.html">Function</a></li>
	
	<li><a href="../symbols/j.html">j</a></li>
	
	<li><a href="../symbols/odr.html">odr</a></li>
	
	<li><a href="../symbols/odr.Association.html">odr.Association</a></li>
	
	<li><a href="../symbols/odr.Callback.html">odr.Callback</a></li>
	
	<li><a href="../symbols/odr.Callback.types.html">odr.Callback.types</a></li>
	
	<li><a href="../symbols/odr.DrawableItem.html">odr.DrawableItem</a></li>
	
	<li><a href="../symbols/odr.Endpoint.html">odr.Endpoint</a></li>
	
	<li><a href="../symbols/odr.Handle.html">odr.Handle</a></li>
	
	<li><a href="../symbols/odr.Line.html">odr.Line</a></li>
	
	<li><a href="../symbols/odr.Rectangle.html">odr.Rectangle</a></li>
	
	<li><a href="../symbols/odr.Registry.html">odr.Registry</a></li>
	
	<li><a href="../symbols/odr.Shape.html">odr.Shape</a></li>
	
	<li><a href="../symbols/String.html">String</a></li>
	
</ul>
<hr />
			<!-- end publish.classesIndex -->
		</div>
		
		<div id="content">
<!-- ============================== class title ============================ -->
			<h1 class="classTitle">
				
				Class odr.DrawableItem
			</h1>

<!-- ============================== class summary ========================== -->			
			<p class="description">
				
				<br />Extends
					<a href="../symbols/odr.Callback.html">odr.Callback</a>.<br />
				
			
				Base class for all entities that can be drawn. A class that inherits from this class states that it can be
drawn and that it knows how to draw itself.
				
				
					<br /><i>Defined in: </i> <a href="../symbols/src/drawing.entities.js.html">drawing.entities.js</a>.
				
			</p>

<!-- ============================== constructor summary ==================== -->			
			
			<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class odr.DrawableItem.">
				<caption>Class Summary</caption>
				<thead>
					<tr>
						<th scope="col">Constructor Attributes</th>
						<th scope="col">Constructor Name and Description</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td class="attributes">&nbsp;</td>
						<td class="nameDescription" >
							<div class="fixedFont">
								<b><a href="../symbols/odr.DrawableItem.html#constructor">odr.DrawableItem</a></b>()
							</div>
							<div class="description">Every entity automatically registers itself with the <a href="../symbols/odr.Registry.html">odr.Registry</a> so that the entity can be retrieved by it's id.</div>
						</td>
					</tr>
				</tbody>
			</table>
			

<!-- ============================== properties summary ===================== -->
			

<!-- ============================== methods summary ======================== -->
			
				
				
				<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class odr.DrawableItem.">
					<caption>Method Summary</caption>
					<thead>
						<tr>
							<th scope="col">Method Attributes</th>
							<th scope="col">Method Name and Description</th>
						</tr>
					</thead>
					<tbody>
					
						<tr>
							<td class="attributes">&nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont"><b><a href="../symbols/odr.DrawableItem.html#dispose">dispose</a></b>()
								</div>
								<div class="description">Release all resources, remove the item from the canvas and remove the item from the registry.</div>
							</td>
						</tr>
					
						<tr>
							<td class="attributes">&nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont"><b><a href="../symbols/odr.DrawableItem.html#extendedId">extendedId</a></b>()
								</div>
								<div class="description">The extended id is the id which is used in the SVG.</div>
							</td>
						</tr>
					
						<tr>
							<td class="attributes">&nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont"><b><a href="../symbols/odr.DrawableItem.html#id">id</a></b>()
								</div>
								<div class="description"></div>
							</td>
						</tr>
					
						<tr>
							<td class="attributes">&nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont"><b><a href="../symbols/odr.DrawableItem.html#paint">paint</a></b>(parent)
								</div>
								<div class="description">Draw the item to the canvas.</div>
							</td>
						</tr>
					
						<tr>
							<td class="attributes">&nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont"><b><a href="../symbols/odr.DrawableItem.html#parent">parent</a></b>(parent)
								</div>
								<div class="description">Define a parent element for this DrawableItem.</div>
							</td>
						</tr>
					
						<tr>
							<td class="attributes">&nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont"><b><a href="../symbols/odr.DrawableItem.html#repaint">repaint</a></b>()
								</div>
								<div class="description">Redraw the item.</div>
							</td>
						</tr>
					
						<tr>
							<td class="attributes">&nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont"><b><a href="../symbols/odr.DrawableItem.html#value">value</a></b>(value)
								</div>
								<div class="description">You can attach an arbitrary value with each DrawableItem.</div>
							</td>
						</tr>
					
						<tr>
							<td class="attributes">&nbsp;</td>
							<td class="nameDescription">
								<div class="fixedFont"><b><a href="../symbols/odr.DrawableItem.html#visible">visible</a></b>(visible)
								</div>
								<div class="description">Show or hide this DrawableItem.</div>
							</td>
						</tr>
					
					</tbody>
				</table>
				
				
				
				<dl class="inheritsList">
				<dt>Methods borrowed from class <a href="../symbols/odr.Callback.html">odr.Callback</a>: </dt><dd><a href="../symbols/odr.Callback.html#dragEnd">dragEnd</a>, <a href="../symbols/odr.Callback.html#dragging">dragging</a>, <a href="../symbols/odr.Callback.html#dragStart">dragStart</a>, <a href="../symbols/odr.Callback.html#draw">draw</a>, <a href="../symbols/odr.Callback.html#redraw">redraw</a>, <a href="../symbols/odr.Callback.html#remove">remove</a>, <a href="../symbols/odr.Callback.html#unbind">unbind</a>, <a href="../symbols/odr.Callback.html#visibility">visibility</a></dd>
				</dl>
				
			
<!-- ============================== events summary ======================== -->
			

<!-- ============================== constructor details ==================== -->		
			
			<div class="details"><a name="constructor"> </a>
				<div class="sectionTitle">
					Class Detail
				</div>
				
				<div class="fixedFont">
						<b>odr.DrawableItem</b>()
				</div>
				
				<div class="description">
					Every entity automatically registers itself with the <a href="../symbols/odr.Registry.html">odr.Registry</a> so that the entity can be retrieved by it's id.
					
				</div>
				
				
				
				
					
					
					
					
					
					
					

			</div>
			

<!-- ============================== field details ========================== -->		
			

<!-- ============================== method details ========================= -->		
			
				<div class="sectionTitle">
					Method Detail
				</div>
				
					<a name="dispose"> </a>
					<div class="fixedFont">
					
					
					<b>dispose</b>()
					
					</div>
					<div class="description">
						Release all resources, remove the item from the canvas and remove the item from the registry. Also, all
listeners should be detached.
						
						
					</div>
					
					
					
						
						
						
						
						
						
						

					<hr />
				
					<a name="extendedId"> </a>
					<div class="fixedFont">
					
					<span class="light">{<a href="../symbols/String.html">String</a>}</span>
					<b>extendedId</b>()
					
					</div>
					<div class="description">
						The extended id is the id which is used in the SVG. Besides the normal id which you can retrieve by calling
odr.DrawableItem.id it also returns some meta information. Mostly this is an id prefix.
						
						
					</div>
					
					
					
						
						
						
						
						
							<dl class="detailList">
							<dt class="heading">Returns:</dt>
							
								<dd><span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> The extended id</dd>
							
							</dl>
						
						
						

					<hr />
				
					<a name="id"> </a>
					<div class="fixedFont">
					
					
					<b>id</b>()
					
					</div>
					<div class="description">
						
						
						
					</div>
					
					
					
						
						
						
						
						
							<dl class="detailList">
							<dt class="heading">Returns:</dt>
							
								<dd>Always returns the automatically generated ID of this DrawableItem</dd>
							
							</dl>
						
						
						

					<hr />
				
					<a name="paint"> </a>
					<div class="fixedFont">
					
					
					<b>paint</b>(parent)
					
					</div>
					<div class="description">
						Draw the item to the canvas. Every implementation should call the odr.Callback.draw method afterwards.
						
						
					</div>
					
					
					
						
							<dl class="detailList">
							<dt class="heading">Parameters:</dt>
							
								<dt>
									<span class="light fixedFont">{DOM element|jQuery element}</span> <b>parent</b>
									<i>Optional</i>
								</dt>
								<dd>An optional parent element. In the resulting SVG, the drawn item
will be a child of the parent item. Can be used to group elements. If ommited, the SVG root element will be the
parent element.</dd>
							
							</dl>
						
						
						
						
						
						
						

					<hr />
				
					<a name="parent"> </a>
					<div class="fixedFont">
					
					<span class="light">{DOM element|jQuery element|odr.DrawableItem}</span>
					<b>parent</b>(parent)
					
					</div>
					<div class="description">
						Define a parent element for this DrawableItem. The parent element can act as a grouping element or container for
it's child element. This value can temporarily be overriden by the parent parameter in <a href="../symbols/odr.DrawableItem.html#paint">odr.DrawableItem#paint</a>.

You can also retrieve the current value by calling this method without parameters.
						
						
					</div>
					
					
					
						
							<dl class="detailList">
							<dt class="heading">Parameters:</dt>
							
								<dt>
									<span class="light fixedFont">{DOM element|jQuery element}</span> <b>parent</b>
									<i>Optional</i>
								</dt>
								<dd>The parent element</dd>
							
							</dl>
						
						
						
						
						
							<dl class="detailList">
							<dt class="heading">Returns:</dt>
							
								<dd><span class="light fixedFont">{DOM element|jQuery element|odr.DrawableItem}</span> The parent which was set or null if no parent was set. If
you call this method with a parameter then the method will return the object on which you called the method
(<a href="http://martinfowler.com/bliki/FluentInterface.html">Fluent Interface</a>)</dd>
							
							</dl>
						
						
						

					<hr />
				
					<a name="repaint"> </a>
					<div class="fixedFont">
					
					
					<b>repaint</b>()
					
					</div>
					<div class="description">
						Redraw the item. Most items will use an optimized algorithm that only modifies the location of the item.
Therefore this method should be called when dragging an item.
						
						
					</div>
					
					
					
						
						
						
						
						
						
						

					<hr />
				
					<a name="value"> </a>
					<div class="fixedFont">
					
					<span class="light">{Object|<a href="../symbols/odr.DrawableItem.html">odr.DrawableItem</a>}</span>
					<b>value</b>(value)
					
					</div>
					<div class="description">
						You can attach an arbitrary value with each DrawableItem. This value may be everything but the most useful
way to use it is to store the data which was used to generate this DrawableItem (like JSON).

You can also retrieve the current value by calling this method without parameters.
						
						
					</div>
					
					
					
						
							<dl class="detailList">
							<dt class="heading">Parameters:</dt>
							
								<dt>
									<span class="light fixedFont">{Object}</span> <b>value</b>
									<i>Optional</i>
								</dt>
								<dd>The value you want to attach or nothing</dd>
							
							</dl>
						
						
						
						
						
							<dl class="detailList">
							<dt class="heading">Returns:</dt>
							
								<dd><span class="light fixedFont">{Object|<a href="../symbols/odr.DrawableItem.html">odr.DrawableItem</a>}</span> The value which was set or null if no value was set. If you call this method
with a parameter then the method will return the object on which you called the method
(<a href="http://martinfowler.com/bliki/FluentInterface.html">Fluent Interface</a>)</dd>
							
							</dl>
						
						
						

					<hr />
				
					<a name="visible"> </a>
					<div class="fixedFont">
					
					<span class="light">{Boolean|<a href="../symbols/odr.DrawableItem.html">odr.DrawableItem</a>}</span>
					<b>visible</b>(visible)
					
					</div>
					<div class="description">
						Show or hide this DrawableItem. When changing the visibility of an iten it will be painted or removed, depending
on the new visiblity.

Initially each DrawableItem is visible.

You can also retrieve the current value by calling this method without parameters.
						
						
					</div>
					
					
					
						
							<dl class="detailList">
							<dt class="heading">Parameters:</dt>
							
								<dt>
									<span class="light fixedFont">{Boolean}</span> <b>visible</b>
									<i>Optional</i>
								</dt>
								<dd>The new visibility</dd>
							
							</dl>
						
						
						
						
						
							<dl class="detailList">
							<dt class="heading">Returns:</dt>
							
								<dd><span class="light fixedFont">{Boolean|<a href="../symbols/odr.DrawableItem.html">odr.DrawableItem</a>}</span> The visibility which was set or null if no parent was set. If you call this
method with a parameter then the method will return the object on which you called the method
(<a href="http://martinfowler.com/bliki/FluentInterface.html">Fluent Interface</a>).</dd>
							
							</dl>
						
						
						

					
				
			
			
<!-- ============================== event details ========================= -->		
			
			
			<hr />
		</div>

		
<!-- ============================== footer ================================= -->
		<div class="fineprint" style="clear:both">
			
			Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.3.2 on Tue Dec 07 2010 13:09:21 GMT+0100 (CET)
		</div>
	</body>
</html>
